let tableIns;
let tree;
layui.use(['element', 'form', 'table', 'layer', 'laydate', 'tree', 'util'], function () {
    let table = layui.table;
    let form = layui.form;//select、单选、复选等依赖form
    let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
    let laydate = layui.laydate;
    tree = layui.tree;
    let height = document.documentElement.clientHeight - 60;

    tableIns = table.render({
        elem: '#detailTable'
        , url: ctx + '/agent/account/detaillist/page'
        , method: 'POST'
        //请求前参数处理
        , request: {
            pageName: 'page' //页码的参数名称，默认：page
            , limitName: 'rows' //每页数据量的参数名，默认：limit
        }
    	, where: {
    		agentAccountId: $("#agentAccountId").val()
    	}
        , response: {
            statusName: 'flag' //规定数据状态的字段名称，默认：code
            , statusCode: true //规定成功的状态码，默认：0
            , msgName: 'msg' //规定状态信息的字段名称，默认：msg
            , countName: 'records' //规定数据总数的字段名称，默认：count
            , dataName: 'rows' //规定数据列表的字段名称，默认：data
        }
        //响应后数据处理
        , parseData: function (res) { //res 即为原始返回的数据
            var data = res.data;
            return {
                "flag": res.flag, //解析接口状态
                "msg": res.msg, //解析提示文本
                "records": data.records, //解析数据长度
                "rows": data.rows //解析数据列表
            };
        }
        , toolbar: '#detailTableToolbar'
        , title: '代理商交易流水'
        , cols: [[
        	{field: 'zizeng', title: '序号', width:80, fixed:'left', align:'center', 
        		templet: function(d){return d.LAY_INDEX;}}
        	
            , {field: 'tradeId', title: '交易ID', hide: true}
            , {field: 'agentAccountId',title: '账号id', hide: true}
            , {field: 'tradeSerial', title: '交易流水号', hide: true}
            , {field: 'payType', title: '交易类别', hide: true}
            , {field: 'paySubject', title: '交易科目code', hide: true}
            , {field: 'operType', title: '交易方向ID', hide: true}
            , {field: 'operName', width:120, title: '交易方向'}
            , {field: 'subName', width:120, title: '交易科目'}
            , {field: 'tradeMoney', width:150, title: '交易金额', align:'right', style:'font-weight:bold',
            	templet: function(d){return formatMoney(d.tradeMoney);}}
            , {field: 'payTime',title: '交易时间'}
            , {field: 'tradeComment',title: '备注'}
            , {field: 'isTotal',title: '是否已汇总', hide: true}
        ]]
        , defaultToolbar: ['', '', '']
        , page: true
        , height: height
        , cellMinWidth: 80
    });
    
    //头工具栏事件
    table.on('toolbar(display)', function (obj) {
        switch (obj.event) {
            case 'query':
                let agentAccountId = $("#agentAccountId").val();
                let startDate = $("#startDate").val();
                let endDate = $("#endDate").val();
                let query = {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , done: function (res, curr, count) {
                        //完成后重置where，解决下一次请求携带旧数据
                        this.where = {};
                    }
                };
                if (startDate && endDate) {
                    //设定异步数据接口的额外参数
                    query.where = {
                    		agentAccountId: agentAccountId
                    		, startDate: startDate
                    		, endDate: endDate
                    		};
                } else if(startDate && !endDate) {
                	query.where = {
                    		agentAccountId: agentAccountId
                    		, startDate: startDate
                    		};
                } else if(!startDate && endDate) {
                	query.where = {
                    		agentAccountId: agentAccountId
                    		, endDate: endDate
                    		};
                }
                
                tableIns.reload(query);
                
                $("#agentAccountId").val(agentAccountId);
                
                // 重新渲染时间控件
                $("#startDate").remove();
                $("#inputStartDate").html('<input type="text" id="startDate" name="startDate" '
                		+'autocomplete="off" placeholder="请输入开始时间" class="layui-input layui-btn-sm">');
            	laydate.render({
            	    elem: '#startDate',
            	    format: "yyyy-MM-dd",
            	    trigger: 'click',
            	    value: startDate
            	});
            	$("#endDate").remove();
            	$("#inputEndDate").html('<input type="text" id="endDate" name="endDate" '
            			+'autocomplete="off" placeholder="请输入结束时间" class="layui-input layui-btn-sm">');
                laydate.render({
                    elem: '#endDate',
                    format: "yyyy-MM-dd",
                    trigger: 'click',
                    value: endDate
            	});
                break;
        }
    });

    //日期选择器
	laydate.render({
	    elem: '#startDate',
	    format: "yyyy-MM-dd",
	    trigger: 'click'
	});
    
    //日期选择器
    laydate.render({
        elem: '#endDate',
        format: "yyyy-MM-dd",
        trigger: 'click'
	});
});
